<!Doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>穿见</title>
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <style>
        /* track base Css */
        .body{
            background-color: #E9EAEB;
            background-repeat: no-repeat;
            background-size:100% 100%;
            -moz-background-size:100% 100%;
        }
    </style>
    <link rel="shortcut icon" href="/img/favicon.ico">
    <link rel="stylesheet" href="/css/resetpw/base.css" />
    <link rel="stylesheet" href="/css/resetpw/layout.css"/>
    <link rel="stylesheet" href="/css/layui.css">
    <link rel="stylesheet" href="/css/zoomify.min.css">
    <link rel="stylesheet" href="/css/font-awesome.css">
    <link rel="stylesheet" href="/css/plugins/summernote/summernote.css">
    <link rel="stylesheet" href="/css/plugins/summernote/summernote-0.8.8.css">
    <link rel="stylesheet" href="/css/awesome-bootstrap-checkbox.css">
    <link rel="stylesheet" href="/css/build.css">
    <link rel="stylesheet" href="/css/front/chuanjian.css">
    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <script type="text/javascript" src="/js/bootstrap.min.js"></script>
    <script src="/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
    <script src="/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
    <script src="/js/plugins/layer/layer.js"></script>
    <script type="text/javascript" src="/layui/layui.js"></script>
    <script type="text/javascript" src="/js/zoomify.min.js"></script>
    <script type="text/javascript" src="/js/plugins/scroll-to/jquery.scrollTo.js"></script>
    <style>
        .goTo{
            display: none;
            position:fixed;   /*当position设置为fixed的时候，元素的位置是相对浏览器窗口的而不是其父容器*/
            right:30px;
            bottom:30px;
            z-index: 10000;
        }
        .toTop{
            width:44px;
            word-break:break-all;
            border:1px solid gray;
            border-radius:40px;
            cursor:pointer;
            border:outset;}
        .demo{width:820px; margin:60px auto 10px auto;}

        .m-sidebar{position: fixed;top: 0;right: 0;background: #000;z-index: 2000;width: 35px;height: 100%;font-size: 12px;color: #fff;cursor: pointer;}
        .cart{color: #fff;text-align:center;line-height: 20px;padding: 200px 0 0 0px;}
        .cart span{display:block;width:20px;margin:0 auto;}
        .cart i{width:35px;height:35px;display:block; background:url(/img/car.png) no-repeat;}
        #msg{position:fixed; top:300px; right:35px; z-index:10000; width:1px; height:52px; line-height:52px; font-size:20px; text-align:center; color:#fff; background:#360; display:none}

        .box{float:left; width:198px;margin-left:5px;display:inline;border:1px solid #e0e0e0; text-align:center;padding:0 0 30px 0;}
        .box .info{height:350px;overflow:hidden;}
        .box p{line-height:20px; padding:4px 10px 10px 10px; text-align:left;font-size:13px;}
        .box:hover{border:1px solid #f90}
        .box h4{line-height:32px; font-size:14px; color:#f30;font-weight:500}
        .box h4 span{font-size:20px}
        .u-flyer{display: block;width: 50px;height: 50px;border-radius: 50px;position: fixed;z-index: 9999;}

        .button {
            display: inline-block;
            outline: none;
            cursor: pointer;
            text-align: center;
            text-decoration: none;
            font: 16px/100% 'Microsoft yahei',Arial, Helvetica, sans-serif;
            padding: .5em 2em .55em;
            text-shadow: 0 1px 1px rgba(0,0,0,.3);
            -webkit-border-radius: .5em;
            -moz-border-radius: .5em;
            border-radius: .5em;
            -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
            -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
            box-shadow: 0 1px 2px rgba(0,0,0,.2);
        }
        .button:hover {
            text-decoration: none;
        }
        .button:active {
            position: relative;
            top: 1px;
        }
        /* orange */
        .orange {
            color: #fef4e9;
            border: solid 1px #da7c0c;
            background: #f78d1d;
            background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
            background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
        }
        .orange:hover {
            background: #f47c20;
            background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
            background: -moz-linear-gradient(top,  #f88e11,  #f06015);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
        }
        .orange:active {
            color: #fcd3a5;
            background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
            background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
            filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
        }
    </style>

</head>
<body>
    <div th:hidden="${hidden}" th:include="include::frontheader">
    </div>
    <div class="goTo">
        <p><button class="toTop">回到顶部</button></p>
    </div>
    <div class="wrapper wrapper-content ">
        <div class="col-sm-12" id="container" style="margin-bottom: 50px;margin-top: 10px;">
            <div class="ibox container" style="margin-top: 10px;padding-top: 10px;">
                <button type="button" class="btn btn-link" data-toggle="collapse"
                        data-target="#form-0">
                    查询（点击折叠或展开）
                </button>
                <button  id="searchBtn" data-id="1"  class="btn btn-success">点击新增查询</button>
                <div class="collapse in"  id="form-0">
                    <div class="fixed-table-toolbar">
                        <div class="form-inline">
                            <div class="form-group">
                                <input name="productType0" id="productType0" class="form-control" placeholder="产品类型"/>
                            </div>
                            <div class="form-group">
                                <input name="productModel0" id="productModel0" class="form-control" placeholder="产品型号"/>
                            </div>
                            <div class="form-group">
                                <input name="secondModel0" id="secondModel0" class="form-control" placeholder="二级型号"/>
                            </div>
                            <div class="form-group">
                                <input name="diameter0" id="diameter0" class="form-control" placeholder="直径"/>
                            </div>
                            <div class="form-group" style="width:15%;text-align: right;">
                                &nbsp;
                            </div>
                        </div>
                        <div class="form-inline">
                            <div class="form-group">
                                <input name="length0" id="length0" class="form-control" placeholder="长度"/>
                            </div>
                            <div class="form-group">
                                <input name="width0" id="width0" class="form-control" placeholder="宽度"/>
                            </div>
                            <div class="form-group">
                                <input name="thickness0" id="thickness0" class="form-control" placeholder="厚度"/>
                            </div>
                            <div class="form-group">
                                <input name="density0" id="density0" class="form-control" placeholder="密度"/>
                            </div>
                            <div class="form-group">
                                <button class="btn btn-success" onclick="search(0)">查询</button>
                            </div>
                        </div>
                    </div>
                    <table id="exampleTable0" data-mobile-responsive="true">
                    </table>
                </div>
            </div>
        </div>
    </div>
    <a href="/front/shopcar" target="_blank">
        <div class="m-sidebar" id="gotoShop">
            <div class="cart">
                <i id="end" th:text="${hasShopNumber}">0</i>
                <span>购物车</span>
            </div>
        </div>
    </a>
    <div id="msg">已成功加入购物车！</div>

    <script src="/js/plugins/fly/jquery.fly.min.js" type="application/javascript"></script>
    <script src="/js/index.js" type="application/javascript"></script>
</body>
</html>
